<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8" isELIgnored="false"%>
<!DOCTYPE html>
<html lang="en">
<head>
<style type="text/css">
	.button{
	 background-color:red;
width:100px;
height:50px;
font-size:20px;
color:white;
font-weight:bold;
border-radius:10px;

			}
</style>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0, initial-scale=1.0, user-scalable=no">
    <title>登录</title>
    <link rel="stylesheet" href="style2/index.css">
</head>
<body class="login-bg">
    <div class="login-contain">
        <div class="login-header">
            <p>欢迎登录</p>
        </div>
        <div class="login-logo" align="center">
            <img src="image2/7.jpeg" alt="">
            <p>划过美好停车生活</p>
        </div>
        <form action="../registerlogin" method="post">
        <div class="form-group">
            <div class="form-item">
                <label for="phone">
                    <img src="image2/phone.png" alt="">
                </label>
                <input type="text"  id="phoneNumber" name="phoneNumber" placeholder="手机号码">
            </div>
            <div class="form-item">
                <label for="code">
                    <img src="image2/code.png" alt="">
                </label>
                 <input type="password"  id="password" name="password" placeholder="密码">
                <!-- <button>发送验证码</button> -->
            </div>
        </div>
        <div class="button-group">
            <input type="hidden" id="hidden" value="${user.userName}">
             <input type="button" id="login" class="button" value="登录"/>
             <input type="button" id="zhuche" class="button" value="注册"/>
        </div>
        </form>
        <div class="casual">
            <a href="#">随便逛逛</a>
        </div>
        <div class="order-login">
            <p>使用第三方账号登录</p>
            <ul>
                <li>
                    <a href="#">
                        <img src="image2/QQ.png" alt="">
                    </a>
                </li>
                <li>
                    <a href="#">
                        <img src="image2/WeChat.png" alt="">
                    </a>
                </li>
                <li>
                    <a href="#">
                        <img src="image2/blog.png" alt="">
                    </a>
                </li>
            </ul>
        </div>
        <div class="copyright">
            该技术由JCP团队提供
        </div>
    </div>
<script src="js2/index.js"></script>
</body>
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
	<script type="text/javascript">
	
			$("#login").click(function(){
		    	var phoneNumber = $("#phoneNumber").val();    //用户名
		    	var password = $("#password").val();      //密码
		    	if(phoneNumber==""||password==""){
		    		alert("请填写完整信息")
		    		window.location = "login1.jsp"
		    	}else{
			    $.ajax({  
	                type: "post",  
	                async:true,
	                data:{phoneNumber:phoneNumber,password:password},
	                dataType:"text",
	                url : "registerlogin",
	                success: function (data) { 
	                	if(data=="登录失败"){
	                		alert("手机号和密码错误请重新登录");
	                		window.location = "login1.jsp"
	                	}
	                	else if(data=="登录成功"){
	                		var username=$("#hidden").val();
	                		alert("username : "+username)
	                		alert("欢迎光临"+username)
	                		window.location = "PaySystem.jsp"
	                	}
	              	}   
	           	});
				}
			})
			$("#zhuche").click(function(){
				
				window.location = "register.jsp"
			})
			</script>
</html>
